<template>
  <div>
    <el-container>
      <el-aside>
        <menus />
      </el-aside>
      <el-container>
        <el-header>
          <VHeader class="header" />
          <tags />
        </el-header>
        <el-main>
          <router-view />
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<script lang="ts" setup>
import VHeader from '@/page/home/head/head.vue'
import tags from '@/page/home/tags/tag.vue'
import menus from '@/page/home/menu/menu.vue'
</script>
<style lang="scss" scoped>
.el-aside {
  height: calc(120vh);
  border-radius: 2px;
  text-align: left;
  width: auto;
  background-color: #f4f4f4;
}

.el-header {
  margin-bottom: 15px;
  padding-bottom: 15px;
}

.el-main {
  margin-top: 15px;
  padding-top: 15px;
}

.breadcrumb {
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 5px;
  height: 20px;
}

.header-card {
  padding: 2px;

  .header {
    background-color: #67c23a;
  }
}
</style>
